const {
  override,
  fixBabelImports,
  addLessLoader,
  addWebpackAlias,
  addDecoratorsLegacy,
  addWebpackPlugin,
} = require('customize-cra');
const path = require('path')
const paths = require('react-scripts/config/paths');
const resolve = (dir) => path.join(__dirname, dir)
const dayjs = require("dayjs")

module.exports = override(
  addDecoratorsLegacy(),

  fixBabelImports('import', {
    libraryName: 'antd-mobile',
    style: 'css',
  }),
  addWebpackAlias({
    ['@src']: resolve('src'),
    ['@assets']: resolve('src/assets/'),
    ['@images']: resolve('src/assets/images'),
    ['@components']: resolve('src/components/'),
    ['@http']: resolve('src/http/'),
    ['@apis']: resolve('src/http/apis/'),
    ['@pages']: resolve('src/pages/'),
    ['@stores']: resolve('src/stores/'),
    ['@styles']: resolve('src/styles/'),
    ['@utils']: resolve('src/utils/'),
  }),
  addLessLoader({
    strictMath: true,
    noIeCompat: true,
    modifyVars: {
      "@primary-color": "#1DA57A", // for example, you use Ant Design to change theme color.
    },
    cssLoaderOptions: {}, // .less file used css-loader option, not all CSS file.
    cssModules: {
      localIdentName: "[path][name]__[local]--[hash:base64:5]", // if you use CSS Modules, and custom `localIdentName`, default is '[local]--[hash:base64:5]'.
    },
  }),
  (config) => {
    // 配置打包后的文件位置
    if (process.env.NODE_ENV === 'production') {
      const buildPath = `${process.env.BUILD_PATH}${dayjs(new Date()).format("YYYY-MM-DD HH-mm-ss")}`;
      paths.appBuild = path.join(path.dirname(paths.appBuild), buildPath);
      config.output.path = path.join(path.dirname(config.output.path), buildPath);

      // index.html 里面静态资源路径
      config.output.publicPath = process.env.PUBLIC_URL;
    }

    return config;
  },
);